<template>
  <div class="sidebar">
    <el-menu  class="sidebar-el-menu" 
              :default-active="onRoutes" 
              :collapse="collapse" 
               background-color="#324157" 
               text-color="#bfcbd9" 
               active-text-color="#20a0ff" unique-opened 
               router>
      <template v-for="item in items">
        <template v-if="item.subs">
          <el-submenu :index="item.index" :key="item.index">
            <template slot="title">
                <i :class="item.icon"></i>
                <span slot="title">{{ item.title }}</span>
            </template>
            <el-menu-item v-for="(subItem,i) in item.subs" :key="i" :index="subItem.index">
              {{ subItem.title }}
            </el-menu-item>
          </el-submenu>
        </template>
        <template v-else>
          <el-menu-item :index="item.index" :key="item.index">
             <i :class="item.icon"></i><span slot="title">{{ item.title }}</span>
          </el-menu-item>
        </template>
      </template>
    </el-menu>
  </div>
</template>

<script>
  import bus from '../common/bus';
  import  { NavBar } from '@/request/api'
  export default {
    data() {
      return {
        collapse: false,
        items:[],
        items1: [
          {
            icon: 'el-icon-setting',
            index: '/home',
            title: '系统首页'
          },
          {
            icon: 'el-icon-tickets',
            index: '1',
            title: '系统用户',
            subs: [
              {
                index: '/userlist',
                title: '用户列表'
              },
              {
                index: '/rolelist',
                title: '角色管理'
              }
            ]
          },
          {
            icon: 'el-icon-message',
            index: '2',
            title: '用户管理',
            subs: [
              {
                index: '/farmerlist',
                title: '供货商列表'
              },
              {
                index: '/merchantlist',
                title: '商家列表'
              },
              {
                index: '/translist',
                title: '运输员列表'
              },
              {
                index: '/deliverylist',
                title: '配送员列表'
              }
            ]
          },
          {
            icon: 'el-icon-date',
            index: '/base',
            title: '供应基地管理'
          },
          // {
          //   icon: 'el-icon-star-on',
          //   index: '/site',
          //   title: '站点管理'
           
          // },
          {
            icon: 'el-icon-rank',
            index: '5',
            title: '订单管理',
            subs: [
              
              {
                index: '/order_1',
                title: '待发货订单'
              },
              {
                index: '/order_2',
                title: '待收货订单'
              },
              {
                index: '/order_3',
                title: '待评价订单'
              },
              {
                index: '/order_4',
                title: '已完成订单'
              },
              {
                index: '/order_6',
                title: '已退款订单'
              }
            ]
          },
          {
            icon: 'el-icon-warning',
            index: '6',
            title: '运输管理',
            subs:[
              {
                index:'/site',
                title:'运输站点管理'
              },
              {
                index:'/waybill_0',
                title:'待分配运单'
              },
              {
                index:'/waybill_1',
                title:'待分配配送单'
              },
              {
                index:'/waybill_2',
                title:'已分配配送单'
              }
            ]
          },
          {
            icon: 'el-icon-tickets',
            index: '7',
            title: '内容管理',
            subs: [
              {
                index: '/banner',
                title: 'banner管理'
              },
              {
                index: '/service_famer',
                title: '供应商服务条款'
              },
              {
                index: '/service_merchant',
                title: '商家服务条款'
              },
              {
                index:'/supply_publish',
                title:'供应端发布条约'
              },
              {
                index:'/preferential_setting',
                title:'优惠卷设置'
              },
              {
                index:'/absout_us',
                title:'关于我们'
              }
             
            ]
          },
          {
            icon: 'el-icon-news',
            index: '8',
            title: '系统管理',
            subs: [
              {
                index: '/params',
                title: '参数设置'
              },
              // {
              //   index: '/logistics',
              //   title: '物流费设置'
              // },
              {
                index: '/syslog',
                title: '系统日志'
              },
               {
                index: '/basecontent',
                title: '基础内容设置'
              }
            ]
          },
          {
            icon: 'el-icon-printer',
            index: '9',
            title: '财务管理',
            subs: [
              {
                index: '/trade',
                title: '交易列表'
              },
               {
                index: '/withdraw',
                title: '提现列表'
               },
               {
                index: '/approveCount',
                title: '认证统计'
               },
               {
                index: '/feeCount',
                title: '服务费统计'
               }
            ]
          }
        ],
        items2:[
              {
                title: "首页",
                icon: "el-icon-setting",
                index: "/home",
                // subs: []
              },
              {
                title: "系统用户",
                icon: "el-icon-tickets",
                index: "1",
                subs: [
                    {
                      title: "用户列表",
                      index: "/userlist",
                      icon: ''
                    },
                    {
                      title: "角色管理",
                      index: "/rolelist",
                      icon: ''
                    }
                ]
              },
              {
                title: "用户管理",
                icon: "el-icon-message",
                index: "2",
                subs: [
                  {
                    title: "供货商列表",
                    index: "/farmerlist",
                    icon: ''
                  },
                  {
                    title: "商家类别",
                    index: "/merchantlist",
                    icon: ''
                  },
                  {
                    title: "运输员类表",
                    index: "/translist",
                    icon: ''
                  },
                  {
                    title: "配送员列表",
                    index: "/deliverylist",
                    icon: ''
                  }
                ]
              },
              {
                title: "供应基地管理",
                icon: "el-icon-date",
                index: "/base",
                subs: []
              },
              {
                title: "订单管理",
                icon: "el-icon-rank",
                index: '3',
                subs: [
                  {
                    title: "待发货订单",
                    index: "/order_1",
                    icon: ''
                  },
                  {
                    title: "待收货订单",
                    index: "/order_2",
                    icon:''
                  },
                  {
                    title: "待评价订单",
                    index: "/order_3",
                    icon: ''
                  },
                  {
                    title: "已完成订单",
                    index: "/order_4",
                    icon: ''
                  },
                {
                  title: "已退款订单",
                  index: "/order_6",
                  icon: ''
                }
                ]
              },
              {
                title: "运输管理",
                icon: "el-icon-warning",
                index: '4',
                subs: [
                  {
                    title: "运输站点管理",
                    index: "/site",
                    icon: ''
                  },
                  {
                    title: "待分配运单",
                    index: "/waybill_0",
                    icon: ''
                  },
                  {
                    title: "待分配配送单",
                    index: "/waybill_1",
                    icon: ''
                  },
                  {
                    title: "已分配配送单",
                    index: "/waybill_2",
                    icon: ''
                  }
                ]
              },
              {
                title: "内容管理",
                icon: "el-icon-tickets",
                index: '5',
                subs: [
                  {
                  title: "banner管理",
                  index: "/banner",
                  icon: ''
                  },
                  {
                  title: "供应商服务条款",
                  index: "/service_famer",
                  icon: ''
                  },
                  {
                  title: "商家服务条款",
                  index: "/service_merchant",
                  icon: ''
                  },
                  {
                    title:'供应端发布条约',
                    index:'/supply_publish',
                    icon: ''
                  },
                  {
                    title:'优惠卷设置',
                    index:'/preferential_setting',
                    icon: ''
                  },
                   {
                    title:'关于我们',
                    index:'/about_us',
                    icon: ''
                  }
                ]
              },
              {
                title: "系统管理",
                icon: "el-icon-news",
                index: '6',
                subs: [
                  {
                    title: "参数设置",
                    index: "/params",
                    icon: ''
                  },
                  {
                    title: "系统日志",
                    index: "/syslog",
                    icon: ''
                  },
                  {
                    title: "基础内容设置",
                    index: "/basecontent",
                    icon: ''
                  }
                ]
              },
              {
                title: "财务管理",
                icon: "el-icon-printer",
                index: '7',
                subs: [
                  {
                    title: "交易列表",
                    index: "/trade",
                    icon: ''
                  },
                  {
                    title: "提现列表",
                    index: "/withdraw",
                    icon: ''
                  },
                  {
                    title: "认证统计",
                    index: "/approveCount",
                    icon: ''
                  },
                  {
                    title: "服务费统计",
                    index: "/feeCount",
                    icon: ''
                  }
                ]
              }
          ]
       }
    },
    computed:{
      onRoutes(){
          // console.log(this.$route.path.split('/').length)
          if(this.$route.path.split('/').length > 2) {
              // console.log('/' + this.$route.path.split('/')[1])
              return '/' + this.$route.path.split('/')[1]
          }else {
              return this.$route.path;
          }
      }
    },
    created(){
      // 通过 Event Bus 进行组件间通信，来折叠侧边栏
      bus.$on('collapse', msg => {
          this.collapse = msg;
      })
      NavBar({ 
        userId:sessionStorage.getItem('userId')
      }).then(res => {
           console.log(res);
           this.items = res.data;
          //  console.log(1,this.items[0].index)
          //  var  index
          //  for(var i=0; i<this.items.length; i++)
          //  {
          //    var item = this.items[i];
          //    if(item.subs){
          //      index = i;
          //      break;
          //    }
          //  }
          //  console.log(index);
           var path ; 
           if( this.items[0].index != 0  ) {
             
                path = this.items[0].index;
           }else {
                path = this.items[0].subs[0].index;
           }
           this.$router.push({
               path:path
           })
      })
    }
  }
</script>

<style scoped>
.sidebar{
  display: block;
  position: absolute;
  left: 0;
  top: 70px;
  bottom:0;
  overflow-y: scroll;
}
.sidebar::-webkit-scrollbar{
  width: 0;
}
.sidebar-el-menu:not(.el-menu--collapse){
  width: 200px;
}
.sidebar > ul {
  height:100%;
}
</style>
